<template>
  <div class="box">
    <p class="p_title">
      <el-button type="text" style="color: #000;font-size: 16px">添加{{roles}}-{{orgname}}</el-button>
    </p>
    <p style="margin: 10px 0;padding: 10px;color: rgb(255,153,51);font-size: 12px;background: rgb(255 242 229)"><i
      class="el-icon-warning"></i>请用身份证号查询你要添加的人员是否已经存在，如没有查询到信息请完善以下信息完成新增人员</p>
    <el-form :model="addUnitForm" :rules="rules" ref="addUnitForm" label-width="130px">
      <el-form-item label="身份证号" prop="sid" class="el_w" style="position: relative">
        <el-input v-model="addUnitForm.sid">
          <el-button slot="append" clearable @click="searchEvent(addUnitForm.sid)">查询</el-button>
        </el-input>
        <el-button style="float: right;position: absolute;top: 0;right:-80px" @click="resetEvent">重置</el-button>
      </el-form-item>
      <el-form-item label="姓名" prop="displayname" class="el_w">
        <el-input v-model="addUnitForm.displayname" :disabled="isEdit"></el-input>
      </el-form-item>
      <el-form-item label="账号" prop="account" class="el_w">
        <el-input v-model="addUnitForm.account" :disabled="isEdit"></el-input>
      </el-form-item>
      <el-form-item label="性别" prop="sex" class="el_w">
        <el-select v-model="addUnitForm.sex" placeholder="请输入性别" style="width: 100%">
          <el-option
            v-for="item in sexBox"
            :key="item.id"
            :label="item.value"
            :value="item.id">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="描述" prop="description" class="el_w">
        <el-input v-model="addUnitForm.description"></el-input>
      </el-form-item>
      <el-form-item label="邮箱" prop="email" class="el_w">
        <el-input v-model="addUnitForm.email"></el-input>
      </el-form-item>
      <el-form-item label="手机号" prop="phone" class="el_w">
        <el-input v-model="addUnitForm.phone"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button type="primary" @click="submitAddUnit('addUnitForm')" style="float: right;">确 定</el-button>
    </div>
  </div>
</template>

<script>
  import {http} from "../../../assets/commonjs/axios";
  import {$aos} from "../../../store/state";
  import {delSurplus} from "../../../assets/commonjs/utils";

  export default {
    name: "addAdmin",
    data() {
      return {
        isEdit:false,
        departmentName: '',
        roleType: '',
        roles: '',
        orgname: '',
        orgid: '',
        code: '',
        name: '',
        sexBox: [   //性别的下拉框数据
          {id: "男", value: "男"},
          {id: "女", value: "女"},
        ],
        addUnitForm: {
          orgid: '',
          orgcode: '',
          orgname: '',
          applyType: 1,//1：新建 2.编辑 3.删除 4 预览
          sid: '',//身份证号
          displayname: '',//姓名
          account: '',//账号
          sex: "",//性别
          description: "",//描述
          email: "",//邮箱,
          phone: "",//手机号
          department: null,
          departmentName: '',
        },
        rules: {
          sid: [
            {required: true, message: "请填写身份证号", trigger: "blur"}
          ],
          displayname: [
            {required: true, message: "请填写姓名", trigger: "blur"}
          ],
          account: [
            {required: true, message: "请填写账号", trigger: "blur"}
          ],
          sex: [
            {required: true, message: "请选择性别", trigger: "change"}
          ],
          phone: [
            {required: true, message: "请填写手机号", trigger: "blur"}
          ],
          email: [
            {required: true, message: "请填写邮箱", trigger: "blur"}
          ],
        },
      }
    },
    created() {
      $aos.getItem('roleType').then(res => {
        this.roleType = res;
        if (res === 0) {
          this.roles = "管理员";
          $aos.getItem('loginData').then(res => {
            this.orgname = res.org.orgname;
          })
          $aos.getItem('unitData').then(res => {
            this.orgid = res.orgid;
            this.addUnitForm.orgcode = res.orgcode;
            this.addUnitForm.orgname = res.orgname;
            this.code = res.orgcode;
            this.name = res.orgname;
          })
        } else if (res === 5) {
          this.roles = "用户"
          $aos.getItem('ksId').then(res => {
            this.ksId = res;
          });
          $aos.getItem('ksName').then(res => {
            this.departmentName = res
          });
          $aos.getItem('loginData').then(res => {
            this.orgid = res.org.orgid;
            this.orgname = res.org.orgname;
            this.addUnitForm.orgcode = res.org.orgcode;
            this.addUnitForm.orgname = res.org.orgname;
            this.code = res.org.orgcode;
            this.name = res.org.orgname;
          })
        }
      })
    },
    methods: {
      searchEvent(sid) {
        if(sid){
          http('post', 'permission/check_user', {
            userCard: sid
          }).then(res => {
            if (res.data.success) {
              this.isEdit = true;
              let info = res.data.data;
              this.addUnitForm = delSurplus(info, this.addUnitForm);
              this.$message({message: res.data.msg, type: 'success'});
            } else {
              this.$message({message: res.data.msg, type: 'warning'});
            }
          })
        }else{
          this.$message({message: '请先填写身份证号再进行查询', type: 'warning'});
        }
      },
      //重置
      resetEvent(){
        this.addUnitForm = {
          orgid: '',
          orgcode: '',
          orgname: '',
          applyType: 1,//1：新建 2.编辑 3.删除 4 预览
          sid: '',//身份证号
          displayname: '',//姓名
          account: '',//账号
          sex: "",//性别
          description: "",//描述
          email: "",//邮箱,
          phone: "",//手机号
          department: null,
          departmentName: '',
        }
        this.isEdit = false;
      },


      submitAddUnit() {
        this.$refs.addUnitForm.validate((valid) => {
          if (valid) {
            this.addUnitForm.orgid = this.orgid;
            this.addUnitForm.orgcode = this.code;
            this.addUnitForm.orgname = this.name;
            this.addUnitForm.applyType = 1;
            if (this.roleType === 5) {//当是管理员时添加用户是要传科室id (depId)
              this.addUnitForm.department = this.ksId;
              this.addUnitForm.departmentName = this.departmentName;
            }
            http('post', 'permission/opera_user', {
              user: this.addUnitForm
            }).then(res => {
              if (res.data.success) {
                $aos.getItem('loginData').then(resr => {
                  resr.userRoles = res.data.data.userRoles;
                  $aos.setItem("loginData",resr)
                })
                this.$message({message: res.data.msg, type: 'success'});
                this.$router.push({path: '/container'});
              } else {
                this.$message({message: res.data.msg, type: 'warning'});
              }
            })
          } else {
            console.log('error submit!!');
            return false;
          }
        });
      }
    }
  }
</script>

<style scoped>
  .box {
    background: #fff;
    height: 100%;
  }

  .p_title {
    padding: 10px 40px 10px 20px;
    margin: 0;
  }

  .el_w {
    width: 30%;
  }

  .dialog-footer {
    margin: 60px;
    width: 40%;
    height: 30px;
    line-height: 30px;
  }
</style>
